<template>
  <div class="state-wrap">
    <div class="float-left-wrap">
      <div>{{ phoneTime($store.state.currentTime) }}</div>
    </div>
    <div class="float-right-wrap">
      <i class="iconfont icon-weizhi"></i>
      <i class="iconfont icon-Cellular4G"></i>
      <i class="iconfont icon-wifi"></i>
      <i class="iconfont icon-iconset0250"></i>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
  computed: {
    phoneTime() {
      return function (time) {
        if (typeof time.getHours != "function") return;
        let hour =
          time.getHours() > 9 ? time.getHours() : "0" + time.getHours();
        let minute =
          time.getMinutes() > 9 ? time.getMinutes() : "0" + time.getMinutes();
        return `${hour}:${minute}`;
      };
    },
  },
};
</script>
<style lang="scss" scoped >
.state-wrap {
  width: 100%;
  height: 3.8%;
  background-color: rgb(237, 237, 237);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.float-left-wrap {
  padding-left: 3%;
  font-size: 14px;
}
.float-right-wrap {
  display: flex;
  padding-right: 14px;
  i {
    margin-left: 5px;
  }
}
</style>